<template>
	<view class="home">
    <view class="homeTitleText">
      <view class="orderText" @click="gotoOrder">查看订单</view>
    </view>
    <view class="homeOrderHeader flex-column" v-for="(item,index) in cabinetData" :key="index">
      <view class="flex-row" style="justify-content: space-between;">
        <view class="homeOrderHeaderText">
          <text>{{item.location}}</text>
        </view>
        <text class="homeOrderTextFree">空闲数：{{item.freeCount}}</text>
      </view>
      <view class="homeOrderContent flex-column">
        <u-section :title="item.organization" color="#2979ff" :font-siz="30" :right="false"></u-section>
        <u-section :title="'充电仓总数 : ' + item.cabinetCount" bold color="#aa0000" :font-siz="30" sub-title="查看详情" @click="gotoDetails(item)" style="margin-top: 5%;"></u-section>
      </view>
    </view>
    <u-tabbar v-model="current" :list="list" :mid-button="true" @change="pageChange" active-color="#007AFF"></u-tabbar>
    <u-no-network></u-no-network>
	</view>
</template>

<script>
	import store from '@/store/index.js'; //需要引入store
	import {mapState} from 'vuex' //引入mapState
  import { cabinetControl, getCabinet } from "@/common/js/api/api.js";
	export default {
		onLoad() {
      uni.startPullDownRefresh();
      this.$bus.$on('pageIndex', (data)=>{
        this.current = data;
      })
      setTimeout(() => {
        this.$bus.$on('refresh', (data)=>{
          if(data === 'refresh') {
            this.getCabinetData();
          }
        })
      },3000)
		},
    onPullDownRefresh() {
      this.getCabinetData();
      setTimeout(() => {
        uni.stopPullDownRefresh();
      }, 500);
    },
    data() {
      return {
        list: [{
          iconPath: "home",
          selectedIconPath: "home-fill",
          text: '首页',
          customIcon: false,
        },
        {
          iconPath: "https://cdn.uviewui.com/uview/common/min_button_select.png",
          selectedIconPath: "https://cdn.uviewui.com/uview/common/min_button_select.png",
          text: '扫码充电',
          midButton: true,
          customIcon: false,
        },
        {
          iconPath: "account",
          selectedIconPath: "account-fill",
          text: '我的',
          customIcon: false,
        }],
        current: 0,
        cabinetData: []
      }
    },
		methods: {
      getCabinetData() {
        this.cabinetData = [];
        getCabinet().then((res) => {
          res.data.content.forEach(item => {
            if(item.organization == '中山职业技术学院') {
              var i = 0;
              var j = 0;
              item.smartModules.forEach(item1 => {
                j += item1.state.length;
                item1.state.forEach(state => {
                  if(state.open == false) {
                    i++;
                  }
                })
              })
              item.cabinetCount = j;
              item.freeCount = i;
              this.cabinetData.push(item);
            }
          })
        }).catch((err) => {
          console.log(err)
        })
      },
      gotoDetails(item) {
        uni.navigateTo({
          url: '../../cabinetDetails/cabinetDetails?cabinetData=' + JSON.stringify(item),
        })
      },
      pageChange(index) {
        if(index == 1) {
          this.scan();
        }
        if(index == 2) {
          uni.switchTab({
            url: '../personal/personal'
          })
          uni.startPullDownRefresh();
          this.$bus.$emit('pageIndex',index);
        }
      },
      beforeDestroy() {
        this.$bus.$off('pageIndex') //解绑navMenu事件
      },
			scan() {
        uni.scanCode({
          onlyFromCamera: true,
          success: (res) => {
            var openData = eval("[" + res.result + "]")[0];
            openData.open = true;
            uni.showModal({
              title: '提示',
              content: '是否要打开该充电仓？',
              success: (res) => {
                if (res.confirm) {
                  this.$bus.$emit('pageIndex',0);
                  cabinetControl(openData).then((res) => {
                    uni.navigateTo({
                      url: '../../lockOpen/lockOpen'
                    })
                  }).catch((err) => {
                    uni.showToast({
                      title: err.response.data.message,
                      icon: "error",
                      duration: 2000
                    });
                  });
                } else if (res.cancel) {
                  this.$bus.$emit('pageIndex',0);
                }
              }
            });
          }
        });
			},
      gotoOrder() {
        uni.navigateTo({
          url: '../../myOrder/myOrder'
        })
      }
		}
	}
</script>

<style>
	@import url("../../../common/css/home.css");
</style>
